<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>常量与变量</title>
</head>
<body>
<!--
  变量是什么：
    白话：一个装东西的盒子
    通俗：变量是计算机用来存储数据的“容器”，它可以让计算机变得有记忆
    （注意：变量并不是数据本身，仅仅是一个用于存储数值的容器，可以理解为是一个个用来装东西的纸箱子）

  变量的基本使用：
    变量的声明：要想使用变量，首先需要创建变量（也称为声明变量或者定义变量）
        语法：
            let 变量名
        实例：
            let age

    变量的赋值：定义了一个变量后，你就能够初始化它（赋值）。在变量名之后跟上一个 “=” ，然后是数值
        语法：
            变量名 = 字面量（值）
        实例：
            age = 18

    变量的更新：变量赋值后，还可以通过简单的给它一个不同的值来更新它
        语法：
            变量名 = 字面量
        实例：
            age = 19

    声明多个变量：变量赋值后，还可以通过简单的给它一个不同的值来更新它
        语法：
            let 变量名1 = 字面量1 , 变量名2 = 字面量2
        实例
            let age = 18 , uname = 'pink'
        (说明：看上去代码长度更短，但是并不推荐这样。为了更好的可读性，请一行只声明一个变量)
        (技巧：不管写到哪里，点一个 ctrl + / 都能给当前所在行注释掉)

    变量的本质：
        内存：计算机中存储数据的地方，相当于一个空间
        变量本质：是程序在内存中申请的一块用于存放数据的小空间

    变量的命名规则与规范：
        规则：必须遵守，不遵守报错
        规范：建议，不遵守不会报错，但不符合业内通识

        1.规则：
            （1）不能用关键字
                 关键字：有特殊含义的字符，JavaScript内置的一些英语词汇。例如: let、var、if、for等
            （2）只能用下划线、字母、数字和$组成，且不能以数字开头
            （3）区分大小写
        2.规范：
            （1）起名要有意义
            （2）遵守小驼峰命名法
                第一个单词首字母小写，后面每个单词首字母大写：
                    userName  myBatis  myHome  password

     var 和 let 的区别：
        var 可以先使用再声明（很不符合逻辑）
        var 声明过的变量可以重复声明（不合理）
        比如变量提升、全局变量、没有块级作用域等
        let 比 var 更符合现在的开发

    变量拓展——数组
      数组（Array）———— 一种将一组数据存储在单个变量名下的优雅方式

         1.声明语法
            let 数组名 = [数据1, 数据2, .... , 数据n]
            let names = ['小明' , '小刚' , '小红' , '小丽']

         2.使用数组
            数组名[索引号]  索引号从 0 开始
            names[0] —— '刘德华'
            names[1] —— '张学友'

         3.一些术语
            元素: 数组中保存的每个元素都叫数组元素
            下标: 数组中数据的编号
            长度: 数组中数据的个数，通过数组的length属性获得

   常量的基本使用：
      概念：使用const声明的变量称为“常量”
      使用场景：当某个变量永远不会改变的时候
      语法：
        const 常量名 = 字面量

   数据类型：
      基本数据类型：
        (1)数字类型: let num = 1  + - * / %    算出来是小数就是小数
           注意：
                 NAN 代表一个计算错误。它是一个不正确的或者未定义的数学操作得到的结果 —————— NAN也是一个值
                 console.log('老师' - 2) // NAN
                 NAN 是粘性的。任何对NAN的操作都会返回NAN
                 console.log( NAN - 2) // NAN
                 NAN !== NAN

        (2)字符串类型: let str =  ''  ""  ``
             注意：
                 单双引号必须成对使用
                 单引号/双引号可以相互嵌套，但是不可以嵌套自己（口诀：外双内单、外单内双）
                 必要时可以加入转义字符\ , 输出单引号或者双引号
                 字符串能用 + 进行拼接
            模板字符串:
                 外面用 `` 把整个字符串括起来
                 里面用 ${} 括起你想引用的字符串值

        (3)布尔类型: let isCool = true

        (4)未定义类型: undefined
                只声明一个变量不给变量赋值，就会默认赋值undefined
                undefined默认不是任何值

        (5)空类型: null
                既声明一个变量也给他赋值，只是赋的值是null
                null默认是个对象，常用于要创建变量但变量还没有赋值的时候
         检测数据类型的方式：
             1，控制台检测法：蓝色是数字或者布尔、黑色是字符串或者undefined
             2，通过typeof关键字检测数据类型
                （1）作为运算符
                        typeof a
                （2）作为函数
                        typeof(a)
         数据转换
            隐式数据转换：
                1. + 只要连接的一个数据是字符串类型，他就会把所有的数字型转换成字符串类型然后拼接在一起
                2. - * / % 只要连接的一个数据是数字类型，他就会把所有的字符串类型转换成数字类型然后减出结果
                3. + 做单目运算符时后面跟一个字符串，能把字符串变成数字 +'123' === 123\
            显示数据转换：
                1. 字符串 ——> 数字
                    Number(str)
                    +str
                    parseInt(str)————一刀切出字符串中的第一个整数————要求字符串第一个必须是数字，不能是其他的东西
                    parseFloat(str)————一刀切出字符串中的第一个浮点数————同上
      引用数据类型：



-->
    <script>
        // 1.声明一个年龄变量
        let age
        // 2.给变量赋值
        age = 19
        // alert(age)
        // 3.声明的时候赋值叫变量初始化
        let name = 'black'
        // 4.变量的更新
        age = 20
        // 5.多变量声明
        let age1 = 10 , name1 = 'ok'
        console.log(age1)
        console.log(name1)

        // 6.案例
        // let yourName = prompt('请输入姓名')
        // alert(yourName)
        // document.write允许这样写
        // document.write(yourName , age1 , name1)


        // 声明数组
        let arr = [10 , 20 , 30]
        let fourKing = ['刘德华' , '张学友' , '黎明' , '郭富城']
        // 使用数组
        console.log(fourKing)
        console.log(fourKing[0]) // 刘德华
        console.log(fourKing[2]) // 黎明
        // 数组术语
        console.log(fourKing.length) // 4 (数组长度 = 索引号 + 1)

        // 声明常量
        const pai = 3.14
        console.log(pai)
        // pai = 3.3 // 不被允许
        // 数字型变量
        console.log(1 + 1)
        console.log(1 % 1)
        console.log(1 / 2)
        // 计算圆的面积
        // let range = prompt('请输入半径')
        // console.log(3.14 * range * range)
        // 通过单引号、双引号、反引号包裹的数据都叫字符串
        let uname = '小明'
        let gender = "男"
        let goods = `小米`
        let tel = '18431254800' //这也是字符串
        console.log(goods)
        console.log("pink老师讲课非常有'激情'")
        console.log('pink老师讲课非常有\'激情\'')
        console.log('pink' + '老师')
        console.log('pink' + goods + '老师') // 只要有一个是字符串相加之后就都是字符串了，let也会转成字符串
        // 模板字符串
        document.write(`大家好我是${uname},我是一个${gender}生\n`)
        // 布尔类型
        let isCool = true
        console.log(isCool)
        // 未定义类型
        let numUndefined
        console.log(numUndefined)
        let numNull = null
        console.log(numNull)

        // 两个区别
        console.log(numUndefined + 1) // 不赋值就不知道是什么类型的变量，如果加1没有任何意义
        console.log(numNull + 1) // 赋值就知道是默认的int型了，加1就是0+1

        // 检测数据类型
        // 控制台输出语句检测数据类型————蓝色是数字或者布尔、黑色是字符串或者undefined
        let age11 = 18
        let name11 = '刘德华'
        let flag = false
        let buy
        let fly = null
        console.log(age11)
        console.log(name11)
        console.log(flag)
        console.log(buy)
        // typeof检测数据类型
        console.log(typeof age11)
        console.log(typeof (age11))
        console.log(typeof name11)
        console.log(typeof flag)
        console.log(typeof buy)
        console.log(typeof fly)

        // 表单中取出来的数据默认是字符串型
        let test1 = prompt('开始测试表单数据类型')
        console.log(typeof test1)
        // +作为单目运算符时能把字符型转换成数字型
        console.log(+ '123')
        console.log(typeof +'123')
        // 字符串——>数字
        let str = '123.22222'
        // Number函数包含
        console.log(Number(str)) // 显式数字转换
        console.log(Number('pink')) // 转不了了回写NaN
        // + 包含
        console.log(+str)
        console.log('开始切割')
        // 整数切割
        console.log(parseInt('12%'))
        console.log(parseInt('12.34%'))
        console.log(parseInt('%12%')) // 第一个字符不是数字，切不了
        console.log(parseInt('12%222')) // 一个字符串中多个数字，只切第一个
        // 小数切割
        console.log(parseFloat('12%'))
        console.log(parseFloat('12.545%'))
        console.log(parseFloat('%12.22%')) // 第一个字符不是数字，切不了
        console.log(parseFloat('12%12.22')) // 一个字符串中多个数字，只切第一个

    </script>
</body>

</html>